<template>
  <footer class="footer">
        <!-- 接收父组件传过来的数组的length -->
    <span class="todo-count">剩余<strong>{{getSum}}</strong></span>
    <ul class="filters">
      <li>
        <a :class="{selected:type==='all' }" href="javascript:;" @click="$emit('changeType','all')">全部</a>
      </li>
      <li>
        <a :class="{selected:type==='no' }" href="javascript:;"  @click="$emit('changeType','no')">未完成</a>
      </li>
      <li>
        <a :class="{selected:type==='yes' }" href="javascript:;"  @click="$emit('changeType','yes')">已完成</a>
      </li>
    </ul>
    <button class="clear-completed" @click="$emit('clearTask')" >清除已完成</button>
  </footer>
</template>

<script>
export default {
props:{
  // 接收父组件传过来的参数 可以指定接收过来的值的数据类型
  type:String,
  getSum:Number
}

}
</script>